<!DOCTYPE html>
<html>
<head>
    <title>jmp2string</title>
    <link href="http://cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet">
    <script src="http://cdn.bootcss.com/jquery/3.0.0-alpha1/jquery.min.js"></script>
    <script src="http://cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</head>
<style type="text/css">
    ul .dropdown-menu {
        /*background-color: gray;*/
    }

    li {
    }

    li .nav-header {
        font-size: 21px;
        padding-left: 5px;
        border-bottom: red solid 1px;
        height: 30px;
        line-height: 30px;
    }
</style>
<body>
<nav class="navbar navbar-default" role="navigation">
    <div class="navbar-header">
        <a class="navbar-brand" href="#">jmp2string</a>
    </div>
    <div>
        <ul class="nav navbar-nav">
            <!--class="active"-->
            <li class="dropdown open">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#"><span id="convert">convert</span><b
                        class="caret"></b></a>
                <ul class="dropdown-menu">

                    <li class="nav-header">
                        Base64
                    </li>
                    <li><a href="#" id="b64e">Base64 encode</a></li>
                    <li><a href="#" id="b64d">Base64 decode</a></li>
                    <li><a href="#" id="b64eu">Base64 encode url friendly</a></li>
                    <li><a href="#" id="b64du">Base64 decode url friendly</a></li>
                    <li><a href="#" id="b64diu">Base64 image url display</a></li>
                    <li><a href="#" id="encodeimgbase64">encode image in Base64 png</a></li>
                    <!-- <li class="divider"></li> -->
                    <li class="nav-header">
                        ascii/hex/bin
                    </li>
                    <li><a href="#" id="doascii">ascii to hex</a></li>
                    <li><a href="#" id="dohex">hex to ascii</a></li>
                    <li><a href="#" id="ascii2bin">ascii to bin</a></li>
                    <li><a href="#" id="bin2ascii">bin to ascii</a></li>
                    <!-- <li class="divider"></li> -->
                    <li class="nav-header">
                        morse
                    </li>
                    <li><a href="#" id="morsee">encode morse</a></li>
                    <li><a href="#" id="morsed">decode morse</a></li>
                    <!-- <li class="divider"></li> -->
                    <li class="nav-header">
                        mED
                    </li>
                    <li><a href="#" id="emED">encode mED</a></li>
                    <li><a href="#" id="dmED">decode mED</a></li>
                </ul>
            </li>
            <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#"><span id="hashs">hashes</span> <b
                        class="caret"></b></a>
                <ul class="dropdown-menu">
                    <li><a href="#" id="crc32">CRC32</a></li>
                    <li><a href="#" id="bCrypt">bCrypt</a></li>
                    <!-- <li class="divider"></li> -->
                    <li class="nav-header">
                        md5
                    </li>
                    <li><a href="#" id="md5h">md5 Hex</a></li>
                    <li><a href="#" id="md564">md5 Base64</a></li>
                    <!-- <li class="divider"></li> -->
                    <li class="nav-header">
                        sha
                    </li>
                    <li><a href="#" id="sha1">sha-1</a></li>
                    <li><a href="#" id="sha224">sha-224</a></li>
                    <li><a href="#" id="sha256">sha-256</a></li>
                    <li><a href="#" id="sha384">sha-384</a></li>
                    <li><a href="#" id="sha512">sha-512</a></li>
                </ul>
            </li>

            <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#"><span id="html">web</span> <b
                        class="caret"></b></a>
                <ul class="dropdown-menu">
                    <li class="nav-header">
                        url
                    </li>
                    <li><a href="#" id="urle">url encode</a></li>
                    <li><a href="#" id="urld">url decode</a></li>
                    <li><a href="#" id="ipde">IP/decimal</a></li>

                    <!-- <li class="divider"></li> -->
                    <li class="nav-header">
                        html
                    </li>
                    <li><a href="#" id="htmle">html encode</a></li>
                    <li><a href="#" id="htmld">html decode</a></li>
                    <li><a href="#modalcolors" data-toggle="modal" id="htmlcolors">HTML colors</a></li>
                    <li><a href="#modalenti" data-toggle="modal" id="enti">HTML symbol entities</a></li>
                    <li><a href="#modalScolors" data-toggle="modal" id="Scolors">color picker</a></li>
                    <li><a href="#" id="xls2html">excel table to HTML</a></li>
                    <!-- <li class="divider"></li> -->
                    <li><a href="#" id="checkxml">check XML structure</a></li>
                    <!-- <li class="divider"></li> -->
                    <li class="nav-header">
                        javascript
                    </li>
                    <li><a href="#" id="escapejavas">escape special chars</a></li>
                    <li><a href="#" id="javascript_escape">escape all string chars</a></li>
                    <li><a href="#" id="html2js">raw HTML to javascript</a></li>

                </ul>
            </li>
            <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#"><span id="others">strings</span> <b
                        class="caret"></b></a>
                <ul class="dropdown-menu">
                    <li><a href="#" id="c2d">commas to periods</a></li>
                    <li><a href="#" id="strlen">string length</a></li>
                    <li><a href="#" id="reve">reverse string</a></li>
                    <li><a href="#" id="rot13">rot13</a></li>
                    <li><a href="#" id="stgs">strip tags</a></li>
                    <li><a href="#" id="addslashes">add slashes</a></li>
                    <li><a href="#" id="stripslashes">strip slashes</a></li>
                    <li><a href="#" id="strtolower">string to lower</a></li>
                    <li><a href="#" id="strtoupper">string to upper</a></li>
                    <li><a href="#" id="ucwords">capitalize string</a></li>
                    <li><a href="#" id="str_shuffle">string shuffle</a></li>
                    <li><a href="#" id="str_repeat">string repeat</a></li>
                    <li><a href="#" id="str_replace">string replace</a></li>
                    <li><a href="#" id="trim">trim string</a></li>
                    <li><a href="#" id="stripsc">strip special characters</a></li>
                    <li><a href="#" id="latin2e">latin chars to english</a></li>
                    <li><a href="#" id="stripcomments">strip comments</a></li>
                    <li><a href="#" id="checkUUID">check UUID</a></li>
                    <li><a href="#" id="generateUUID">generate UUID4/ID</a></li>
                    <li><a href="#" id="loremipsun">lorem ipsum generator</a></li>
                </ul>
            </li>
        </ul>
    </div>
</nav>
<div class="container">
    <div class="row-fluid">
        <div id="dyn" style=";">
            <form>
                <fieldset>
                    <legend style="">
                        <span id="action">encode</span>
                    </legend>
                    <textarea style="width:100%;min-height:129px;" id="eandd" class="span6 ucode" autofocus></textarea>

                    <div id="imgB64Alert" class="span6" style="display:none;">Warning: This function is still experimental. Large files may generate partial content or make your browser become unresponsive if your computer has insufficient memory. If necessary, click the loader to cancel. We would appreciate your feedback if something goes wrong.</div>
                    <br>

                    <div class="input-prepend input-block-level" id="encodeimgbase64f" style="display:none;">

                        <br>
                        <br>
                        <input id="base64File" name="base64File" accept="image/*" class="span6" type="file">
                    </div>

                    <!--STR_RPT-->
                    <div class="input-prepend input-block-level" id="rptstr" style="display:none;">
                        <span class="add-on" id="rptinfo"></span>
                        <input class="span2" type="number" id="t2r" name="t2r" min="2" max="128000" step="1" value="2"
                               maxlength="6">
                        <!-- 12800 runs smoothly in Core I7, but higher numbers can crash the browser,
                        maybe implement WebWorkers in future? -->
                    </div><!--/STR_RPT-->

                    <!--SHAOPTIONS-->
                    <select style="width:100%; display:none;" id="shaopt">
                        <option value="HEX">Hex</option>
                        <option value="B64">Base64</option>
                    </select><!--/SHAOPTIONS-->

                    <!--STR_REPLACE-->
                    <div class="input-prepend input-block-level" id="strrep" style="display:none;">
                        <span class="add-on" id="replaceinfo"></span>
                        <input class="span7" type="text" id="strreplace" name="strreplace">

                        <span class="add-on" id="replaceflaginfo"></span>
                        <input class="span1" style="width:31px;" type="text" id="strflag" name="strflag">
                        <br>
                        <span class="add-on" id="replaceforinfo"></span>
                        <input class="span9" type="text" id="strfor" name="strfor">
                    </div>
                    <!--/STR_REPLACE-->

                    <!--bCrypt-->
                    <div class="input-prepend input-block-level" id="bCryptDiv" style="display:none;">
                        <span class="add-on" id="LbCPass">Password</span>
                        <input class="span9" type="text" id="bcPass">
                        <br>

                        <span class="add-on" id="lbCSalt">Salt</span>
                        <input class="span9" type="text" id="bcSalt">
                        <br>
                        <span class="add-on" id="replaceforinfo">Rounds</span>
                        <select class="span2" id="rounds" name="rounds">
                            <option value=5>5</option>
                            <option value=6>6</option>
                            <option value=7>7</option>
                            <option value=8>8</option>
                            <option value=9>9</option>
                            <option value=10>10</option>
                            <option value=11>11</option>
                            <option value=12>12</option>
                        </select>

                    </div>
                    <!--/bCrypt-->

                    <!-- LIMP -->
                    <div class="input-prepend input-block-level" id="liopts" style="display:none;">
                        <input class="span2" type="number" id="lir" name="lir" max="128000" step="10" value="50"
                               maxlength="6">
                        <br>

                        <select id="liopt">
                            <option value="words" id="liwds" selected="true">Words</option>
                            <option value="characters" id="lichars">Characters</option>
                            <option value="paragraphs" id="lipar">Paragraphs</option>
                        </select>
                        <br>
                        <select id="lipsel">
                            <option value="true" id="lipt">Add p tag</option>
                            <option value="false" id="lipf" selected="true">Don't add p tag</option>
                        </select>
                    </div><!--/LIMP-->

                    <button class="btn btn-default" id="doit" type="button">Do It!</button>
                    <span id="btns"><button class="btn btn-default" id="paste">Paste</button>
                      <a class="btn btn-default" id="btnOpenFile" href="#modalfiles" data-toggle="modal"
                         style="font-weight: normal;">Open</a>
                      <button class="btn btn-default" id="btnAbort" style="display:none;">Abort</button></span>
                    <br><span id="tbchartotal"></span>
                </fieldset>
            </form>

            <fieldset>
                <legend id="result" style="">Result</legend>
                <pre class="pre-scrollable freturn" style="min-height:113px;margin-top:0px;" class="span6"
                     id="freturn"></pre>
                <button class="btn btn-default" id="copy" style="margin-top:-2px;" type="button">
                    Copy
                </button>
                <button class="btn btn-default" id="view" style="margin-top:-2px;" type="button">
                    RAW HTML
                </button>
                <button class="btn btn-default" id="savebtn" style="margin-top:-2px;" type="button">
                    Save
                </button>
                <br><span id="frchartotal"></span>

            </fieldset>
        </div><!--/NRF-->
    </div><!--/DYN-->
</div>


<div id="modalhtml" class="modal hide fade" tabindex="-1" role="dialog">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">
            ×
        </button>
        <h3 id="modalhtml_title">Viewer</h3>
    </div>
    <div class="modal-body">
        <p id="modalhtmlcontent"></p>
    </div>
    <div class="modal-footer">
        <button class="btn btn-inverse" id="modalhtml_close" data-dismiss="modal" aria-hidden="true"></button>
    </div>
</div>
<!--/MODALHTML-->

<!--MODALENTI-->
<div id="modalenti" class="modal hide fade" tabindex="-1" role="dialog">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">
            ×
        </button>
        <h3 id="modalenti_title"></h3>
    </div>
    <div class="modal-body">
        <table class="table table-condensed table-hover">
            <thead>
            <tr>
                <th id="modalenti_character"></th>
                <th id="modalenti_enumber"></th>
                <th id="modalenti_ename"></th>
            </tr>
            </thead>
            <tbody id="modalenti_table"></tbody>
        </table>
    </div>
    <div class="modal-footer">
        <button class="btn btn-inverse" id="modalenti_close" data-dismiss="modal" aria-hidden="true"></button>
    </div>
</div>
<!--/MODALENTI-->

<!--MODALCOLORS-->
<div id="modalcolors" class="modal hide fade" tabindex="-1" role="dialog">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">
            ×
        </button>
        <h3 id="modalcolors_title"></h3>
    </div>
    <div class="modal-body">
        <table class="table table-condensed">
            <thead>
            <tr>
                <th id="modalcolors_color"></th>
                <th id="modalcolors_name"></th>
                <th id="modalcolors_hexvalue"></th>
            </tr>
            </thead>
            <tbody id="modalcolors_table"></tbody>
        </table>
    </div>
    <div class="modal-footer">
        <button class="btn btn-inverse" id="modalcolors_close" data-dismiss="modal" aria-hidden="true">Close</button>
    </div>
</div>
<!--/MODALCOLORS-->

<!--MODALSCOLORS-->
<div id="modalScolors" class="modal hide fade" tabindex="-1" role="dialog">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">
            ×
        </button>
        <h3 id="modalScolors_title"></h3>
    </div>
    <div class="modal-body">

        <input class="minicolors" data-control="wheel" type="text" value="#ffffff" style="float:right;">

        <h4 id="minicolorsvalue" class="muted"> HEX: #ffffff
            <br>
            RGB: rgb(255, 255, 255) </h4>
    </div>
    <div class="modal-footer">
        <button class="btn btn-inverse" id="modalScolors_close" data-dismiss="modal" aria-hidden="true">Close</button>
    </div>
</div>
<!--/MODALSCOLORS-->

<!--MODALFILES-->
<div id="modalfiles" class="modal hide fade" tabindex="-1" role="dialog">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">
            ×
        </button>
        <h3 id="modalfiles_title">Open file</h3>
    </div>
    <div class="modal-body">
        <h5 id="modalfile_info" class="muted">Warning: Opening large or binary files may crash your browser.</h5>

        <input type="file" id="openfilefield" name="openfilefield"/>


    </div>
    <div class="modal-footer">
        <button class="btn btn-inverse" id="modalfiles_open" data-dismiss="modal" aria-hidden="true">Open</button>
        <button class="btn btn-inverse" id="modalfiles_close" data-dismiss="modal" aria-hidden="true">Close</button>
    </div>
</div>

    <link rel="stylesheet" href="./res/css/jquery.minicolors.css">
    <!--_/CSS-->
    <!--_SCRIPTS-->
    <!-- JQuery -->
    <!-- UI Plugins -->
    <!-- Encode/Decode Plugins -->
    <script src="./res/javascript/jquery.base64.js"></script>
    <script src="./res/javascript/md5.js"></script>
    <script src="./res/javascript/sha.js"></script>
    <script src="./res/javascript/stringsopt.js"></script>
    <script src="./res/javascript/html.js"></script>
    <script src="./res/javascript/mED.js"></script>
    <script src="./res/javascript/crc32.js"></script>
    <script src="./res/javascript/jxmlvali-min.js"></script>
    <script src="./res/javascript/jquery.minicolors.js"></script>
    <script src="./res/javascript/jquery.lorem.js"></script>
    <script src="./res/javascript/isaac.js"></script>
    <script src="./res/javascript/bCrypt.js"></script>
    <!-- Initiate LGApp -->
    <script src="./res/javascript/htmltables.js"></script>
    <script src="./res/javascript/about.js"></script>
    <script src="./res/javascript/texteditor.js"></script>
    <script src="./res/javascript/globalcore.js"></script>
    <!-- Open/Save Plugin requires global.js -->
    <script src="./res/javascript/save.js"></script>

</body>
</html>
